{% load static from staticfiles %}
<!DOCTYPE html>
<html lang="en">
<head>
{% block head %}
	<title>{{ PAGE_TITLE }} - {{ WEBSITE_TITLE }}</title>
	<meta charset="utf-8">
	{% block css %}
	{% endblock %}
	<link rel="stylesheet" href="{%static "jquery-ui-1.10.3/themes/base/jquery.ui.dialog.css"%}" media="screen"/>
	<link rel="stylesheet" href="{%static "css/reset.css"%}" type="text/css" media="screen"/>
	<link rel="stylesheet" href="{%static "css/style.css"%}" type="text/css" media="screen"/>
	<link rel="stylesheet" href="{%static "css/grid.css"%}" type="text/css" media="screen"/> 
	<link rel="stylesheet" type="text/css" media="all" href="{%static "css/base.css" %}" />
	<link rel="stylesheet" type="text/css" media="all" href="{%static "jquery-ui-1.10.3/themes/base/jquery-ui.css" %}"/>
	
	<script src="{%static "jquery-1.10.2.min/jquery-1.10.2.min.js" %}"></script>
	<script src="{%static "jquery-ui-1.10.3/ui/jquery-ui.js" %}"></script>
	<script src="{%static "js/script.js" %}" type="text/javascript" ></script>	 
	<script src="{%static "js/easyTooltip.js" %}" type="text/javascript"></script>
{% endblock %}
<script>
$(function() {
	$("#menu").menu();
}); 
function opendialog(e,url,titre) {
			$(e).dialog({
	                  //autoOpen: true,
	                             title: titre,
	                             position: 'top',
	                             width:'auto',
	                             show: "slide",
	                             hide: "puff",
	                             modal: true,
	                             resizable: false
	                              
	        });
			$.get(url, function(data) {
				$(e).html(data);
			});
	}
function create( template, vars, opts ) {
				return $notifications.notify("create", template, vars, opts);
			}
$notifications = $("#notifications").notify();
	            
	            {% if notifications %}
					{% for message in notifications %}
			            create("notyfying_{{ forloop.counter }}",
					           {},
					           { custom: false,
								 expires: 5000
							   });
					{% endfor %}
				{% endif %}



{% block javascriptload %}
{% endblock %}
</script>
{% block audessus %}
	<div class="dial" id="dialog1"></div>
	<div class="dial" id="dialog2"></div>
	<div class="dial" id="dialog3"></div>
	<div class="dial" id="dialog4"></div>
	
	<div class="popup" id="customPopup1">	</div>
	<div class="popup" id="customPopup2">	</div>
	<div class="popup" id="customPopup3">	</div>
	
{% endblock %}	
</head>
<body id="page5">
<div class="extra">
<!--==============================header=================================-->
	<header>
			<div class="menu-row"><div class="main"><div class="container_12"><div class="grid_12">
							<nav class="fleft">
								<ul class="services-menu">
									<li class="m1"><a href="index.html"></a></li>
									<li class="m2"><a href="contacts.html"></a></li>
									<li class="m3"><a href="#"></a></li>
								</ul>
							</nav>
							<nav class="fright">
								<ul class="main-menu">
									<li><a href="index.html">Trang Chủ</a></li>
									<li><a href="about.html">Dịch vụ</a></li>
									<li><a href="gallery.html">Hình Ảnh</a></li>
									<li class="active"><a href="contacts.html">Liên hệ</a></li-->
								</ul>
							</nav>
			</div></div></div></div>
			<div class="header-row"><div class="main"><h1 class="margin-bot">
				<a href="index.html">BeautyCenter</a><em>Đồng hành cùng công nghệ</em>
			</h1>	</div></div>
		</header>
		{% block submenu %}{% endblock %}
<!--==============================content================================-->
		<section id="content">
			<div class="main">
				{% block content0 %}{% endblock %}
				<div class="container_12">
					<div class="wrapper">
						<article class="grid_8">
							{% block menu %}{% endblock %}
						</article>
						<article class="grid_4">
							{% block content %}{% endblock %}
						</article>
					</div>
				</div>
			</div>		
		</section>
	<div class="block"></div>
</div>

<!--==============================footer=================================-->
{% block footer %}
	<footer>
		<div class="footer-bg">
			<div class="main">
				<div class="container_12">
					<div class="wrapper">
						<div class="grid_12">
							<div class="wrapper">
								<span class="footer-text">DNTN Kiều Anh &copy; July 2013 Website by NGUYỄN ĐÕ ĐĂNG KHOA - Template from <a href="http://www.templatemonster.com/" target="_blank" rel="nofollow">www.templatemonster.com</a></span>
								<ul class="list-services">
									<li>Follow Us:</li>
									<li class="item-1"><a class="tooltips" title="facebook" href="#"></a></li>
									<li class="item-2"><a class="tooltips" title="twitter" href="#"></a></li>
									<li class="item-3"><a class="tooltips" title="picasa" href="#"></a></li>
								</ul>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</footer>
{% endblock %}
<!-- Gestion de l'affichage des notifications -->
			{% if notifications %}
			<div id="notifications">
				{% autoescape off %}
				{% for message in notifications %}

				<div class="shadowblack {% if message.tags == "error" %}ui-state-error{% else %}ui-state-highlight{% endif %}" id="notyfying_{{ forloop.counter }}">
					<a class="ui-notify-close" href="#">
						<span class="ui-icon ui-icon-close" style="float:right"></span>
					</a>
					<span class="ui-icon ui-icon-{% if message.tags == "error" %}alert{% else %}info{% endif %}" style="float: left; margin-right: .3em; text-align: center;"></span>
					{{ message }}
				</div>

				{% endfor %}
				{% endautoescape %}
			</div>
			{% endif %}
		<!-- FIN gestion des notifications -->
</body>
</html>
